<!DOCTYPE html>
<head>
    <meta charset="UTF-8">
    <title>用户管理</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <script src="../../assets/js/jquery-2.0.3.min.js"></script>
    <script src="../../assets/js/bootstrap.min.js"></script>
    <script src="../../assets/js/bootstrap.table/bootstrap-table.min.js" type="text/javascript"></script>
    <script src="../../assets/js/bootstrap.table/bootstrap-table-zh-CN.min.js" type="text/javascript"></script>
    <script src="../../assets/js/jquery.ztree.all.min.js"></script>
    <script src="../../assets/js/dialog.js"></script>
    <script src="../../assets/js/jquery.cookie.js" type="text/javascript"></script>
    <script src="../../assets/js/common.js" type="text/javascript"></script>
    <script src="../../assets/js/myUrl.js" type="text/javascript"></script>

    <link href="../../assets/css/bootstrap.min.css" rel="stylesheet" />
    <link href="../../assets/css/bootstrap.table/bootstrap-table.min.css"/>
    <link href="../../assets/css/dialog.css" rel="stylesheet" />
    <link href="../../assets/css/zTreeStyle.css" rel="stylesheet" />
</head>
<style type="text/css">
    a,a:hover,a:visited,a:link{
        cursor: pointer;
        text-decoration: none;
    }
</style>
<script type="text/javascript">

$(function () {
    initTable();
    $("#btn_add").on("click",function () {
        window.location.href = "editUserInfo.html"
    })

    $("#btn_edit").on("click", function () {
        var valueInfo = $('#mytab').bootstrapTable('getSelections');
        if(valueInfo!=null&&valueInfo!=""&&valueInfo.length>0){
            window.location.href = "editUserInfo.html?btnPurid="+btnPurid+"&id="+valueInfo[0].id;
        }else {
            promptDail("请选择一条数据！");
        }
    })

    $("#btn_delete").on("click",function () {
        var valueInfo = $('#mytab').bootstrapTable('getSelections');
        if(valueInfo!=null&&valueInfo!=""&&valueInfo.length>0){
            var options = {"userId": valueInfo[0].id};
            removeCommon(local_url.user_delete, options);
        }else {
            promptDail("请选择一条数据！");
        }
    })

});

function initTable() {
    var options = {"userName" : $("#userName").val()};
    commonInitTable(local_url.user_list, "mytab", options);
}

</script>
<body style="padding:5px;">
<div class="panel panel-default" >
    <div class="panel-heading">
        查询条件
    </div>
    <div class="panel-body form-group" style="margin-bottom:0px;">
        <form id="searchForm">
            <label class="col-sm-2 control-label" style="width: 10%;text-align: right; margin-top:5px">用户名称：</label>
            <div class="col-sm-2">
                <input type="text" class="form-control" name="userName" id="userName"/>
            </div>
            <div class="col-sm-1">
                <button class="btn btn-primary" id="search_btn" onclick="initTable();return false;">查询</button>
            </div>
        </form>
    </div>
</div>
<div id="toolbar" class="btn-group pull-right"  style="margin: 0px 0px 5px 0px;">
    <button id="btn_edit" type="button" class="btn btn-default btn-purview" style=" border-radius: 0">
        <span class="glyphicon glyphicon-pencil"  ></span>修改
    </button>
    <button id="btn_delete" type="button" class="btn btn-default btn-purview" >
        <span class="glyphicon glyphicon-remove" ></span>删除
    </button>
    <button id="btn_add" type="button" class="btn btn-default btn-purview">
        <span class="glyphicon glyphicon-plus" ></span>新增
    </button>
</div>
<table id="mytab" data-toggle="table" class="table table-hover table-bordered" data-single-select="true"
       data-toolbar-align="right" data-toolbar="#toolbar" data-pagination="true"  data-page-size="10"
       data-page-list="[10,20,30]" data-pagination-h-align="right" data-pagination-detail-h-align="left"
       data-pagination-loop="false" data-click-to-select="true" >
    <colgroup>
        <col style="width: 2%">
        <col style="width: 30%">
        <col style="width: 30%">
        <col style="width: 30%">
    </colgroup>
    <thead>
    <tr >
        <th data-align="center" data-valign="middle" data-checkbox="true" ></th>
        <th data-align="center" data-valign="middle" data-field="id" >id</th>
        <th data-align="center" data-valign="middle" data-field="userName">用户名称</th>
        <th data-align="center" data-valign="middle" data-field="userPassword">用户名称</th>
    </tr>
    </thead>
</table>
<div id="editResource" style="display: none;">
    <div style="width: 100%;margin-top: 10px;">
        <form class="form-horizontal" id="roleForm" role="form">
            <input id="roleIds" name="roleIds" hidden="hidden"/>
            <div style="width: 200px;height: 200px;overflow-y: auto;overflow-x: hidden">
                <ul id="treeDemo" class="ztree" style="width: 200px;height: 200px;">

                </ul>
            </div>
        </form>
    </div>
</div>
</body>
<script type="text/javascript">
    function initFormat(val, row, index) {
        if(val==1||val=="1"){
            return "有效";
        }else {
            return "无效";
        }
    }

    function initEdit(val, row, index) {
        var html = "";
        html += "<a href='javascript:void(0)' onclick='editRole("+row.id+")'>【设置角色】</a>"
        html += "<br><a href='javascript:void(0)' onclick='editPasswd("+row.id+")'>【重置密码】</a>"
        return html;
    }

</script>
</html>